<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<link rel="stylesheet" href="css/style.css">
	</head>
	<body>
		<div class="container">
			<div class="top-ny">
				<div class="top-con clearfix">

					<div class="logo">
						<img src="img/logo.png" alt="">
					</div>

					<div class="top-con-middle">
						<ul>
							<li id="template4"><a  href="">网站首页</a></li>
						</ul>
					</div>
					<div class="top-con-right">
						<div class="tel">
							0535-60652189
						</div>
						<ul>
							<li><a href=""><img src="img/qq0.png" alt=""></a></li>
							<li><a href=""><img src="img/wb0.png" alt=""></a></li>
							<li><a href=""><img src="img/wx0.png" alt=""></a></li>
							<li><a href=""><img src="img/email0.png" alt=""></a></li>
						</ul>
					</div>
				</div>
			</div>
			<div class="main-ny">
				<div class="main-ny-banner">
					<img src="img/banner-ny.jpg" alt="">
					<div class="bt-dh">
						<div class="bt-dh-con">
							<a href="">网站首页</a>&nbsp;&gt;&nbsp;<a href="">传悦观点</a>
						</div>
					</div>
				</div>
				<div class="main-ny-lb case">
					<ol>

						<li class="on">全部</li>
						<li>网站建设</li>
						<li>推广运营</li>
						<li>品牌策划</li>
						<li>网络全案</li>
					</ol>
					<div class="case-wrap">
						<ul>
							<li id="template6">
								<a  href="">
									<span class="li-img">
										<img src="" alt="图片未加载">
									</span>
									<span class="li-bt">
										众德集团 网站建设
									</span>
									<span class="li-zy"></span>
								</a>
							</li>
						</ul>
					</div>
				</div>
			</div>
			<div class="footer-ny">
				<div class="footer-ny-con">
					<img class="logo-b" src="img/logo-b.png" alt="">
					<div class="footer-ny-con-right">
						<div class="dh-b"><a  id="template5" href=""></a></div>
						<p>Copyright ©2013 创梦网络科技有限责任公司 ‖ 传悦 Chnyoo.cn All Rights Reserved 京ICP备12005221号 </p>
					</div>
				</div>
			</div>
		</div>
	</body>
	<script>
		let ol = document.querySelector("ol");
		ol.onclick = function(evt) {
			let e = evt || event;
			let target = e.target || e.srcElement;
			if (target.tagName === "LI") {
				for (var i = 0; i < ol.children.length; i++) {
					ol.children[i].className = ""
				}
				target.className = "on"
			}
		}
	</script>
	<script>
		let ul = document.querySelector(".case-wrap ul");
		let template4 = document.querySelector("#template4");
		let template5 = document.querySelector("#template5");
		let template6 = document.querySelector("#template6");
		let navUl = document.querySelector(".top-con-middle ul");
		let fnav = document.querySelector(".dh-b")
		let http = new XMLHttpRequest();
		http.open("get", "http://10.35.164.79:82/message");
		http.send();
		http.onreadystatechange = function() {
			if (http.readyState === 4) {
				let nav = JSON.parse(http.responseText);
				nav.forEach(function(item,index) {
					let newItem4 = template4.cloneNode(true);
					let newItem5 = template5.cloneNode(true);
					let newItem6 = template6.cloneNode(true);
					newItem6.setAttribute("data-id", `${item.id}`);
					newItem4.id = "";
					newItem5.id = "";
					newItem6.id = "";
					var t1 = item.date.slice(0, 7);
					var t2 = item.date.slice(8, 10);
					newItem6.querySelector("a").href = `http://10.35.164.79/qyz/case_cont.html?id=${item.id}`;
					newItem6.querySelector(".li-bt").innerHTML = item.cases;
					newItem6.querySelector(".li-zy").innerHTML = item.labels;
					newItem6.querySelector(".li-img img").src = item.casesimg;
					ul.appendChild(newItem6);
					newItem4.querySelector("a").innerHTML = item.cn;
					newItem4.querySelector("a").href = `http://10.35.164.79/qyz/${item.link}`;
					if(index===1 || index===4){
						newItem4.querySelector("a").href = `javascript:;`;
					};
					newItem5.innerHTML = item.bnav;
					fnav.appendChild(newItem5);
					if(item.cn!==null){
						navUl.appendChild(newItem4);
					}
				})
				console.log(nav)
			}
		}
	</script>
</html>
